<template>
  <div id="cinema">
    <div :style="{visibility: noShow}">cinema</div>
    <div :style="{visibility: noShow}">cinema</div>
    <div :style="{visibility: isShow}">cinema</div>
    <div :style="{visibility: noShow}">cinema</div>
    <div :style="{visibility: noShow}">cinema</div>

    <hr style="height: 1px; border: none; border-top: 1px solid #555555" />
    <span @click="change()">click</span>
  </div>
</template>

<script>
export default {
  name: "cinema",
  data() {
    return {
      isShow: 'visible',
      noShow: 'hidden'
    };
  },
  methods: {
    change() {
      this.isShow[1] = false;
    },
  },
};
</script>

<style scoped>
</style>